<template>
  <span @click="router.toHome(props.userId)" class="user-link link">
    @{{ userName(props.userName, props.userId) }}
  </span>
</template>

<script lang="ts" setup>
import { userName } from "@/utils/common";
import router from "@/router/router";

const props = defineProps({
  userName: {
    required: true,
    type: String,
  },
  userId: {
    required: true,
    type: String,
  },
});
</script>

<style lang="scss" scoped>
.user-link {
  color: #409eff;
}
</style>
